<template>
    <div class="edit-popup">
        <popup
                ref="popupRef"
                :title="popupTitle"
                :async="true"
                width="550px"
                @confirm="handleSubmit"
                @close="handleClose"
        >
            <el-form ref="formRef" :model="formData" label-width="164px" :rules="formRules">
                <el-form-item label="信用代码:" prop="comCode">
                    <el-input
                            v-model="formData.comCode"
                            placeholder="请输入信用代码"
                            :maxlength="100"
                    />
                </el-form-item>
                <el-form-item label="类型:" prop="licenseType">

                    <el-tree-select
                            class="flex-1"
                            v-model="formData.licenseType"
                            :data="optionsData.dept"
                            clearable
                            node-key="id"
                            :props="{
                            value: 'typeCode',
                            label: 'typeName'
                        }"
                            check-strictly
                            :default-expand-all="true"
                            placeholder="请选择类型"
                    />
                </el-form-item>
                <el-form-item label="名称:" prop="licenseName">
                    <el-input
                            v-model="formData.licenseName"
                            placeholder="请输入名称"
                            :maxlength="100"
                    />
                </el-form-item>
                <el-form-item label="内容:" prop="licenseContent">
                    <el-input
                            v-model="formData.licenseContent"
                            placeholder="请输入内容"
                            :maxlength="100"
                            type="textarea"
                    />
                </el-form-item>
                <el-form-item label="开始时间:" prop="licenseStarttime">
                    <el-date-picker
                            v-model="formData.licenseStarttime"
                            type="date"
                            placeholder="请选择开始时间"
                            format="YYYY-MM-DD"
                            value-format="YYYY-MM-DD"
                    />
                </el-form-item>
                <el-form-item label="结束时间:" prop="licenseEndtime">
                    <el-date-picker
                            v-model="formData.licenseEndtime"
                            type="date"
                            placeholder="请选择结束时间"
                            format="YYYY-MM-DD"
                            value-format="YYYY-MM-DD"
                    />
                </el-form-item>
                <el-form-item label="来源:" prop="licenseFrom">
                    <el-input
                            v-model="formData.licenseFrom"
                            placeholder="请输入来源"
                            :maxlength="100"
                    />
                </el-form-item>

            </el-form>
        </popup>
    </div>
</template>
<script lang="ts" setup>
    import type { FormInstance } from 'element-plus'
    import { licensesEdit, licensesAdd1,licensestypeAll  } from '@/api/licenses/licenses'
    import Popup from '@/components/popup/index.vue'
    import { useDictOptions } from '@/hooks/useDictOptions'
    import {deptAll} from "@/api/org/department";
    const emit = defineEmits(['success', 'close'])
    const formRef = shallowRef<FormInstance>()
    const popupRef = shallowRef<InstanceType<typeof Popup>>()
    const mode = ref('add')
    const popupTitle = computed(() => {
        return mode.value == 'edit' ? '编辑类型' : '新增类型'
    })
    const formData = reactive({
        comCode: '',
        licenseType:'',
        licenseName:'',
        licenseContent:'',
        licenseStarttime:'',
        licenseEndtime:'',
        licenseFrom:'',
        id:''
    })
    const { optionsData } = useDictOptions<{
        dept: any[]
    }>({
        dept: {
            api: licensestypeAll
        }
    })
    const checkMobile = (rule: any, value: any, callback: any) => {
        if (!value) {
            return callback()
        } else {
            const reg = /^[1][3,4,5,6,7,8,9][0-9]{9}$/
            console.log(reg.test(value))
            if (reg.test(value)) {
                callback()
            } else {
                return callback(new Error('请输入正确的手机号'))
            }
        }
    }
    const formRules = {

        typeName: [
            {
                required: true,
                message: '请输入类型名称',
                trigger: ['blur']
            }
        ],
        px: [
            {
                required: true,
                message: '请输入排序',
                trigger: ['blur']
            }
        ],

    }



    const handleSubmit = async () => {
        await formRef.value?.validate()
        mode.value == 'edit' ? await licensesEdit(formData) : await licensesAdd1(formData)
        popupRef.value?.close()
        emit('success')
    }

    const open = (type = 'add') => {
        mode.value = type
        popupRef.value?.open()
    }

    const setFormData = (data: Record<any, any>) => {
        Object.keys(formData).forEach(key => {
            if (data[key] != null && data[key] != undefined) {
                formData[key] = data[key]
            }
        })
        formData.isKey=formData.isKey+''
    }

    const getDetail = async (row: Record<string, any>) => {
        const data = await deptDetail({
            id: row.id
        })
        setFormData(data)
    }

    const handleClose = () => {
        emit('close')
    }

    defineExpose({
        open,
        setFormData,
        getDetail
    })
</script>
